<template>
  <Presentation ref="presentationRef" :data="formUpdate" :rules="updateFormRules" :items="updateFormItems" :exclude="exclude"
    @submit="submit" @reset="reset" />
</template>

<script lang="ts" setup>
import refComponent from '@/utils/refComponent';
import Presentation from '@/components/base/presentation.vue';

import { ElMessage } from 'element-plus';
import { ref, reactive, watch } from 'vue';
import { numberToString, packParams } from '@/utils/formUtil';
import { base, ${dv}, updateFormItems, updateFormRules } from '../ts/main';

const emit = defineEmits(['success']);
const props = defineProps(['idVal']);
const formUpdate = reactive<${dv}>(new ${dv});
const exclude: Array<keyof ${dv}> = [${exclude}];
const presentationRef = refComponent(Presentation);

const submit = async () => {
  const res = await base.baseApi.update(packParams(formUpdate));
  if (res.isSuccess) {
    emit('success', res.data)
    ElMessage.success(res.message);
    presentationRef.value?.closeLoading();
  } else {
    ElMessage.error(res.message);
  }
}

let preData: ${dv};
const updateData = (idVal: string) => {
  base.baseApi.info(idVal).then(res => {
    if (res.isSuccess) {
      preData = numberToString(res.data);
      reset();
    } else {
      ElMessage.error(res.message);
    }
  });
}

const reset = () => {
  Object.assign(formUpdate, preData);
}

watch(() => props.idVal, updateData, { immediate: true });
</script>

<style lang="scss" scoped></style>